﻿@page "/Home/Index"
@inherits YiMeiJiaService.Assembly.BaseComponent
@using YiMeiJiaLibModel.Config
@using YiMeiJiaApp.Pages.Home
<div class="top_nav">
    <div class="weui-flex top-nav-tit">
        <div class="weui-flex__item cm-txt-left top-nav-title">@ApiConf.AppName</div>
        <div class="weui-flex__item cm-txt-right top-nav-dvimg">
            <img src="@ApiConf.ApiStatic()/images/chat_white.png" />
        </div>
    </div>
    @* 搜索 *@
    <div class="weui-flex">
        <div class="weui-flex__item cm-txt-left top-nav-title">
            <div class="weui-search-bar" id="searchBar">
                <form class="weui-search-bar__form">
                    <div class="weui-search-bar__box">
                        <i class="weui-icon-search"></i>
                        <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索" required="">
                        <a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
                    </div>
                    <label class="weui-search-bar__label" id="searchText">
                        <i class="weui-icon-search"></i>
                        <span>搜索</span>
                    </label>
                </form>
                <a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
            </div>
        </div>
    </div>
    @* 推荐的分类 *@
    <div class="weui-flex nav-recommend">
        <div class="weui-flex__item nav-recommend-item cm-txt-center">
            <a class="cm-a _category-a" data-id="-1" href="javascript:void(0);" @onclick="GetGoodsRecommendList"> 推荐</a>
        </div>
        @if (_categorys != null && _categorys.Any())
        {
            <script>
                $.hideLoading();
            </script>
            foreach (var item in _categorys)
            {
                <div class="weui-flex__item nav-recommend-item cm-txt-center">
                    <a class="cm-a _category-a" data-id="@item.id" href="javascript:void(0);">@item.name</a>
                </div>
            }
        }
        else
        {
            <script>
                $.showLoading('正在为您选品');
            </script>

        }
    </div>

</div>
@* 商品列表 *@
<div class="dv-shop-container-style"></div>
@* 外面的边框 *@
<div class="dv-shop-container-main cm-txt-center">
    @* 推荐专区 *@
    <div class="dv-ship-container-recommend cm-txt-center">
        <div class="weui-grids">
            <a href="" class="weui-grid js_grid">
                <div class="weui-grid__icon">
                    <img src="@ApiConf.ApiStatic()/Images/miaosha.png " alt="">
                </div>
                <p class="weui-grid__label">
                    秒杀专区1
                </p>
            </a>
            <a href="" class="weui-grid js_grid">
                <div class="weui-grid__icon">
                    <img src="@ApiConf.ApiStatic()/Images/miaosha.png " alt="">
                </div>
                <p class="weui-grid__label">
                    秒杀专区2
                </p>
            </a>
            <a href="" class="weui-grid js_grid">
                <div class="weui-grid__icon">
                    <img src="@ApiConf.ApiStatic()/Images/miaosha.png " alt="">
                </div>
                <p class="weui-grid__label">
                    秒杀专区3
                </p>
            </a>
            <a href="" class="weui-grid js_grid">
                <div class="weui-grid__icon">
                    <img src="@ApiConf.ApiStatic()/Images/miaosha.png " alt="">
                </div>
                <p class="weui-grid__label">
                    秒杀专区4
                </p>
            </a>

        </div>
    </div>
    @* 商品 *@
    <div class="dv-shop-container">
        @if (_recommmendGoods != null && _recommmendGoods.Any())
        {
            foreach (var item in _recommmendGoods)
            {
                <div class="shop-item cm-txt-center" @onclick="@(()=> GoDetail(item.id))">
                    <div class="shop-item-img">
                        <img src="@item.image" />
                    </div>
                    <div class="shop-item-desc">
                        <p class="desc-tit">@item.name</p>
                        <p class="desc-price">原价<s>@item.mktprice</s>   </p>
                        <p class="desc-other">现价 : <span>@item.price</span></p>
                    </div>
                </div>
            }
        }


    </div>
</div>

<script>
    $("#shop-tabbar").slideDown();
</script>